<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Data Table</title>

    <!-- ================= Favicon ================== -->

    <!-- Styles -->
    <link href="__VIS__/css/lib/font-awesome.min.css" rel="stylesheet">
    <link href="__VIS__/css/lib/themify-icons.css" rel="stylesheet">
    <link href="__VIS__/css/lib/menubar/sidebar.css" rel="stylesheet">
    <link href="__VIS__/css/lib/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="__VIS__/js/tree/jquery.treegrid.min.css">
    <link href="__VIS__/css/lib/unix.css" rel="stylesheet">
    <link href="__VIS__/css/style.css" rel="stylesheet">
</head>

<body>

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-8 p-r-0 title-margin-right">
                    <div class="page-header">
                        <div class="page-title">
                            <h1>系统菜单</h1>

                        </div>
                    </div>
                </div>
                <!-- /# column -->
                <div class="col-lg-4 p-l-0 title-margin-left">
                    <div class="page-header">
                        <div class="page-title">
                            <ol class="breadcrumb text-right">
                                <li><a href="#">系统设置</a></li>
                                <li class="active" ><a href="{:url('index')}">系统菜单</a></li>
                            </ol>
                        </div>
                    </div>
                </div>
                <!-- /# column -->
            </div>
            <!-- /# row -->
            <section id="main-content">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card alert">
                            <div class="card-header">
                                <h4>系统菜单列表 </h4>
                                <div class="card-header-right-icon">
                                    <ul>
                                        <li class="card-close" data-dismiss="alert"><i class="ti-close"></i></li>
                                        <li class="doc-link"><a href="#"><i class="ti-link"></i></a></li>
                                        <li class="vis-re"><i class="fa fa-refresh"></i> 刷新数据</li>
                                    </ul>
                                </div>
                            </div>
                            <div class="bootstrap-data-table-panel">
                                <div class="table-responsive">
                                    <div class="table-toolbar">

                                    </div>
                                    <table id="row-select" class="display table table-borderd table-hover">
                                        <a href="{:url('admin/auth/edit')}" class="btn btn-default btn-outline"><i class="fa fa-plus"></i>添加新菜单</a>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!-- /# card -->
                    </div>
                    <!-- /# column -->
                </div>
                <!-- /# row -->


            </section>
        </div>




<div id="search">
    <button type="button" class="close">×</button>
    <form>
        <input type="search" value="" placeholder="type keyword(s) here" />
        <button type="submit" class="btn btn-primary">Search</button>
    </form>
</div>
<!-- jquery vendor -->
<script src="__VIS__/js/lib/jquery.min.js"></script>
<script src="__VIS__/js/lib/jquery.nanoscroller.min.js"></script>
<!-- nano scroller -->
<script src="__VIS__/js/lib/menubar/sidebar.js"></script>
<script src="__VIS__/js/lib/preloader/pace.min.js"></script>
<!-- sidebar -->
<script src="__VIS__/js/lib/bootstrap.min.js"></script>
        <script src="__VIS__/js/layer/layer.js"></script>
<!-- bootstrap -->

<!--<script src="__VIS__/js/scripts.js"></script>-->
 <!--&lt;!&ndash;scripit init&ndash;&gt;-->
<!--<script src="__VIS__/js/lib/data-table/datatables.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/dataTables.bootstrap.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/dataTables.buttons.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/buttons.bootstrap.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/jszip.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/pdfmake.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/vfs_fonts.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/buttons.html5.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/buttons.print.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/buttons.colVis.min.js"></script>-->
<!--<script src="__VIS__/js/lib/data-table/datatables-init.js"></script>-->

<!--treetable-->
        <script type="text/javascript" src="__VIS__/js/tree/bootstrap-table.js"></script>
        <script type="text/javascript" src="__VIS__/js/tree/bootstrap-table-zh-CN.js"></script>
        <script type="text/javascript" src="__VIS__/js/tree/bootstrap-table-treegrid.js"></script>
        <script type="text/javascript" src="__VIS__/js/tree/jquery.treegrid.min.js"></script>
        <script>
            $(function () {
                var $table = $("#row-select");
                $table.bootstrapTable({
                    url:"{:url('index')}",
                    striped:true,
                    sidePagenation:'server',
                    search: true,
                    showRefresh: true,
                    idField:'id',
                    columns:[
                        {
                            field: 'ck',
                            checkbox: true
                        },{
                            field:'id',
                            title:'ID'
                        },
                        {
                            field:'name',
                            title:'名称'
                        },{
                            field:'module',
                            title:'模块'
                        },{
                            field:'controller',
                            title:'控制'
                        },
                        {
                            field:'function',
                            title:'方法'
                        },{
                            field:'description',
                            title:'描述'

                        },{
                            field:'type',
                            title:'类型',
                            formatter: typeshow
                        },{
                            field:'is_display',
                            title:'类型',
                            formatter: isdisplay
                        },{
                            field:'create_time',
                            title:'创建时间'
                        },{
                            field: 'operate',
                            title: '操作',
                            events : 'biEvents',
                            formatter: operatebtn
                        }


                    ],
                    treeShowField: 'name',
                    parentIdField: 'pid',
                    onLoadSuccess: function(data) {
                        $table.treegrid({
                            initialState: 'collapsed',//收缩
                            treeColumn: 2,//指明第几列数据改为树形
                            expanderExpandedClass: 'fa fa-caret-down',
                            expanderCollapsedClass: 'fa fa-caret-right',
                            onChange: function() {
                                $table.bootstrapTable('resetWidth');
                            }
                        });
                    }
                });
                function typeshow(value, row, index) {
                    if (value == 1) {
                        return '权限节点';
                    } else {
                        return '正常节点';
                    }
                }
                function isdisplay(value, row, index) {
                    if (value == 1) {
                        return '作为菜单显示';
                    } else {
                        return '作为正常操作';
                    }
                }
                function operatebtn(value, row, index) {
                    return [
                        '<button type="button" class="add btn btn-small btn-outline" style="margin-right:5px;"><i class="fa fa-plus" ></i></button>',
                        '<button type="button" class="edit btn btn-small btn-outline" style="margin-right:5px;"><i class="fa fa-pencil-square-o" ></i></button>',
                        '<button type="button" class="delete btn btn-small btn-outline" style="margin-right:5px;"><i class="fa fa-trash-o" ></i></button>'
                    ].join('');

                }
                window.biEvents = {
                    'click .add': function (e, value, row, index) {

                        window.location.href="{:url('admin/auth/edit')}?pid="+row.id;
                    },
                    'click .delete': function (e, value, row, index) {
                        var id=row.id;
                        layer.confirm('确定要删除?', function(index) {
                            $.ajax({
                                url:"{:url('admin/auth/delete')}",
                                data:{id:id},
                                success:function(res) {
                                    layer.msg(res.msg);
                                    if(res.code == 1) {
                                        setTimeout(function(){
                                            window.location.href = res.url;
                                        },1500)
                                    }
                                }
                            })
                        })
                    },
                    'click .edit': function (e, value, row, index) {

                        window.location.href="{:url('admin/auth/edit')}?id="+row.id;
                    }
                };

                $("button[name= 'refresh']").hide();
                $('.vis-re').click(function () {
                    $("button[name= 'refresh']").click();
                })
            })

        </script>
        <script>

        </script>
</body>

</html>